<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>钻石投票_云存储设置</title>
    <link rel="stylesheet" type="text/css" href="__MCSS__/bass.css">
    <link rel="stylesheet" type="text/css" href="__CSS__/font-awesome.css">
    <link rel="stylesheet" href="__JS__/layui/css/layui.css">
    <link rel="stylesheet" href="__MCSS__/cloud-set.css">
</head>
<body>

<div class="cloud-set">

    <div class="cloud-main">

        <p class="cloud-set-tit"><span class="span1">系统设置</span><i class="fa fa-caret-right"></i><span class="span2">云存储设置</span></p>

        <div class="cloud-list">
            <p class="cloud-list-tit">开启接口：</p>
            <div class="cloud-set-on {if condition="$config_array && $config_array.oss_type != 0"}  cloud-active" style="opacity: 1;" {else /} " {/if}>
            <div class="cloud-set-off">
                    <ul class="cloud-set-list" {if condition="$config_array && $config_array['oss_type'] != 0"}style="left: 0px; opacity: 1;"{else /}{/if}>
                        <li  class="cloud-set-li">开</li>
                        <li class="cloud-slider cloud-set-li {if condition="$config_array && $config_array['oss_type'] != 0"}cloud-active{else /}{/if}"></li>
                        <li class="cloud-set-li">关</li>
                    </ul>
                </div>
            </div>
        </div>

        <div class="cloud-content" style="{if condition="$config_array && $config_array['oss_type'] != 0"} display:block; {else /} display:none; {/if} ">
            <div class="cloud-list">
                <p class="cloud-list-tit">云存储机构：</p>
                <div class="cloud-list-choose">
                    {if condition="$config_array && $config_array['oss_type'] != 2"}
                    <div data-type="1" class="cloud-choose cloud-active2">阿里云</div>
                    <div data-type="2" class="cloud-choose">七牛云</div>
                    {else /}
                    <div data-type="1" class="cloud-choose">阿里云</div>
                    <div data-type="2" class="cloud-choose cloud-active2">七牛云</div>
                    {/if}
                </div>
            </div>

            <div class="cloud-container">
                <div class="cloud-main1 {if condition="$config_array && $config_array['oss_type'] == 2"}cloud-none{else /}{/if}">

                    <div class="cloud-list">
                        <p class="cloud-list-tit">AccessID：</p>
                        <input type="text" name="" id="ali_accessid" value="{$config_array['oss_access_key'] ?? ''}">
                    </div>

                    <div class="cloud-list">
                        <p class="cloud-list-tit">SecretKey：</p>
                        <input type="text" name="" id="ali_secretkey" value="{$config_array['oss_secret_key'] ?? ''}">
                    </div>

                    <div class="cloud-list">
                        <p class="cloud-list-tit">空间名称：</p>
                        <input type="text" name="" id="ali_bucket" value="{$config_array['oss_bucket'] ?? ''}">
                    </div>
                    <div class="cloud-list">
                        <p class="cloud-list-tit">地域节点：</p>
                        <input type="text" name="" placeholder="不需要填写 http://"  id="ali_endpoint" value="{$config_array['oss_endpoint'] ?? ''}">
                    </div>
                    <div class="cloud-list">
                        <p class="cloud-list-tit">绑定域名：</p>
                        <input type="text" name="" placeholder="不需要填写 http://"  id="ali_domain" value="{$config_array['oss_domain'] ?? ''}">
                    </div>
                </div>

                <div class="cloud-main1  {if condition="!$config_array || $config_array['oss_type'] != 2"}cloud-none{/if}">
                    <div class="cloud-list">
                        <p class="cloud-list-tit">AccessKey：</p>
                        <input type="text" name="" id="qiniu_key" value="{$config_array['qiniu_access_key'] ?? ''}">
                    </div>

                    <div class="cloud-list">
                        <p class="cloud-list-tit">SecretKey：</p>
                        <input type="text" name="" id="qiniu_secret" value="{$config_array['qiniu_secret_key'] ?? ''}">
                    </div>

                    <div class="cloud-list">
                        <p class="cloud-list-tit">空间名称：</p>
                        <input type="text" name="" id="qiniu_bucket" value="{$config_array['qiniu_bucket'] ?? ''}">
                    </div>
                    <div class="cloud-list">
                        <p class="cloud-list-tit">绑定域名：</p>
                        <input type="text" name="" placeholder="不需要填写 http://" id="qiniu_domain" value="{$config_array['qiniu_domain'] ?? ''}">
                    </div>

                </div>
            </div>

            <div class="cloud-footer">
                <div class="lcg-btn5 cloud-keep">保存</div>
                <div class="lcg-btn5 cloud-test">测试</div>
            </div>

        </div>

    </div>
</div>
<!-- 页面加载 -->
<div class="cloud-set-loading cloud-none"><i class="fa fa-spinner fa-pulse fa-2x fa-fw"></i></div>

<script src="__JS__/jquery_v3.3.1.js"></script>
<script type="text/javascript" src="__JS__/layer/layer.js"></script>
<script type="text/javascript" src="__JS__/layui/layui.js"></script>
<script type="text/javascript">
    //切换开关
    $('.cloud-set-on').click(function () {
        var type = 0;
        if ($('.cloud-set-list').css('left') === '-34px') {
            //动态效果
            $('.cloud-set-on').addClass('cloud-active').stop().animate({opacity: '1'});
            $('.cloud-slider').addClass('cloud-active');
            $('.cloud-set-list').stop().animate({left: '0px', opacity: '1'}, 100);
            $('.cloud-content').stop().slideDown();
            //默认开启阿里云OSS存储
            $(".cloud-active2").removeClass("cloud-active2");
            $(".cloud-list-choose > div:eq(0)").addClass("cloud-active2");
        } else {
            //动态效果
            $('.cloud-set-on').removeClass('cloud-active').stop().animate({opacity: '0.8'});
            $('.cloud-slider').removeClass('cloud-active');
            $('.cloud-set-list').stop().animate({left: '-34px', opacity: '1'}, 100);
            $('.cloud-content').stop().slideUp();

            //发送数据，修改配置
            $.post("/admin/system/setConfig", {"oss_type": "0"}, function (result) {
                if(result){
                    layer.msg("设置成功");
                }else{
                    layer.msg("设置失败");
                }
            });
        }
    });

    //切换云存储器
    $('.cloud-list-choose div').click(function () {
        var btn = $(this);
        var index = btn.index();

        if (btn.hasClass("cloud-active2")) {
            return false;
        }
        $('.cloud-choose').removeClass('cloud-active2');
        $(this).addClass('cloud-active2');

        $('.cloud-container').css({marginLeft: '50px'}).animate({marginLeft: '0px'}, 300);
        $('.cloud-container .cloud-main1').eq(index).show().siblings().hide();
    });

    //点击测试按钮
    $('.cloud-test').click(function () {
        $('.cloud-set-loading').removeClass('cloud-none');
        //测试
        var type = $(".cloud-active2").data("type"),
            json;
        if (type === 1) {
            json = {
                'oss_type': type,
                'oss_access_key': $("#ali_accessid").val(),
                'oss_secret_key': $("#ali_secretkey").val(),
                'oss_bucket': $("#ali_bucket").val(),
                'oss_endpoint': $("#ali_endpoint").val(),
                'oss_domain': $("#ali_domain").val()
            };
        } else {
            json = {
                'oss_type': type,
                'qiniu_access_key': $("#qiniu_key").val(),
                'qiniu_secret_key': $("#qiniu_secret").val(),
                'qiniu_bucket': $("#qiniu_bucket").val(),
                'qiniu_domain': $("#qiniu_domain").val()
            };
        }
        $.ajax({
            url: "/admin/system/testUp",
            data: json,
            type: "post",
            success: function (result) {
                $('.cloud-set-loading').addClass('cloud-none');
                if (result) {
                    layer.msg("配置可用");
                } else {
                    layer.msg("配置不可用");
                }
            },
            error:function (request) {
                console.log(request);
                $('.cloud-set-loading').addClass('cloud-none');
                layer.msg("配置不可用");
            }
        });
        
    });

    // 点击保存按钮
    $('.cloud-keep').click(function () {
        var type = $(".cloud-active2").data("type"),
            json;
        var patt = /^http/;
        if (type === 1) {
            json = {
                'oss_type': type,
                'oss_access_key': $("#ali_accessid").val(),
                'oss_secret_key': $("#ali_secretkey").val(),
                'oss_bucket': $("#ali_bucket").val(),
                'oss_endpoint': $("#ali_endpoint").val(),
                'oss_domain': $("#ali_domain").val()
            };
            if(json.oss_domain){
                if(!patt.test(json.oss_domain)){
                    json.oss_domain = "http://" + json.oss_domain;
                }
            }
        } else {
            json = {
                'oss_type': type,
                'qiniu_access_key': $("#qiniu_key").val(),
                'qiniu_secret_key': $("#qiniu_secret").val(),
                'qiniu_bucket': $("#qiniu_bucket").val(),
                'qiniu_domain': $("#qiniu_domain").val()
            };
            if(json.qiniu_domain){
                if(!patt.test(json.qiniu_domain)){
                    json.qiniu_domain = "http://" + json.qiniu_domain;
                }
            }
        }
        //发送数据，修改配置
        $.post("/admin/system/setConfig", json, function (result) {
            if (result) {
                layer.msg("保存成功");
            } else {
                layer.msg("保存失败");
            }
        });
    });

</script>
</body>
</html>